<html>
<head>
    <title>Test for http://bugs.webkit.org/show_bug.cgi?id=12079</title>
    <style type="text/css">
        div.playground { position: relative; width: 90px; height: 90px; }
        .red { background-color: yellow; }
        .blue { background-color: blue; }
        .green { background-color: green; }
        .zero { height: 0; width: 60px; }
        .half { height: 30px; width: 60px; }
        .full { height: 60px; width: 60px; }
    </style>
</head>
<body>
    <div class="playground">
        <table cellpadding="0" cellspacing="0">
            <caption id="caption1" class="blue zero"></caption>
            <tbody>
                <tr>
                    <td class="red half"></td>
                </tr>
                <tr>
                    <td class="green half"></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div class="playground">
        <table cellpadding="0" cellspacing="0">
            <tbody>
                <tr>
                    <td><div id="top" class="blue zero"></div></td>
                </tr>
            </tbody>
            <tbody>
                <tr>
                    <td class="red half"></td>
                </tr>
                <tr>
                    <td class="green half"></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div class="playground">
        <table cellpadding="0" cellspacing="0">
            <caption id="caption2" class="half"></caption>
            <tbody>
                <tr>
                    <td class="green half"></td>
                </tr>
                <tr>
                    <td class="red half"></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div class="playground" style="margin-top: 30px;">
        <table cellpaddin="0" cellspacing="0" style="width: 60px; border-collapse: collapse; border: 8px solid green;">
            <caption style="width: 10px; margin: auto;">
                <div id="innerDiv" style="height: 15px"></div>
            </caption>
            <tbody>
                <tr><td class="half"></td></tr>
                <tr><td class="half" style="border-top: solid yellow 8px;"></td></tr>
            </tbody>
        </table>
    </div>
</body>
</html>
